<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>vue学习</title>
	<script src="js/vue.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/lodash@4.13.1/lodash.min.js"></script>

</head>
<body>
<div id="app" >
  <myslot>
    <img src="img/head.png">
  </myslot>
</div> 

<template id="my_slot">
  <div id="panel">
    <h2 class="panel_header">插槽的头部</h2>
    <!-- 预留一个插槽 -->
    <slot>插槽</slot>
    <footer>插槽尾部</footer>
  </div>
</template>
</body>
</html>

<script> 
Vue.component('myslot',{
  template:'#my_slot'
});
//注册父组件
 new Vue({
  el: '#app',
  data:{
   

  },
  methods:{
    
  }


})
</script>